---
type: tutorial
unitTitle: Поставьте курс на острова Astro
title: 'Шаг 6 - Острова Astro'
description: |-
  Руководство: Создайте свой первый блог в Astro —
  Используйте острова Astro для добавления компонентов фреймворка на ваш сайт в Astro
i18nReady: true
---
import Badge from '~/components/Badge.astro';
import Box from '~/components/tutorial/Box.astro';
import Checklist from '~/components/Checklist.astro';
import MultipleChoice from '~/components/tutorial/MultipleChoice.astro';
import Option from '~/components/tutorial/Option.astro';


Теперь, когда у вас есть полностью функционирующий блог, давайте добавим некоторые интерактивные острова на ваш сайт!

## Где мы находимся сейчас?

Вы можете найти код на этом этапе учебника на [GitHub](https://github.com/withastro/blog-tutorial-demo/tree/unit-6/start) или [StackBlitz](https://stackblitz.com/github/withastro/blog-tutorial-demo/tree/unit-6/start?file=src/pages/index.astro).

Сравните ваш код с этим примером, или, если вы только что присоединились к нам, создайте форк на StackBlitz, чтобы начать кодировать прямо в вашем браузере отсюда.

## Куда мы идем?

В этом разделе вы будете использовать **острова Astro** для внедрения компонентов фреймворка в ваш сайт на Astro.

Вы сможете:
- Добавить в ваш проект Astro UI-фреймворк, Preact
- Использовать Preact для создания интерактивного компонента приветствия
- Узнать, когда бы вы _не_ выбрали острова для интерактивности


<Box icon="check-list">

## Чек-лист

<Checklist key ="interactivity">
- [ ] Я готов добавить некоторую интерактивность на мой сайт и начать жить жизнью на островах!
</Checklist>
</Box>
